<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>RD.Camera</title>
    <link rel="stylesheet" href="http://yui.yahooapis.com/3.9.1/build/cssgrids/cssgrids-min.css">
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
    <link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
    <link rel="icon" href="../assets/favicon.ico">
    <script src="http://yui.yahooapis.com/combo?3.9.1/build/yui/yui-min.js"></script>
</head>
<body class="yui3-skin-sam">

<div id="doc">
    <div id="hd" class="yui3-g header">
        <div class="yui3-u-3-4">
                <h1><img src="../assets/css/logo.png" title="" width="117" height="52"></h1>
        </div>
        <div class="yui3-u-1-4 version">
            <em>API Docs for: </em>
        </div>
    </div>
    <div id="bd" class="yui3-g">

        <div class="yui3-u-1-4">
            <div id="docs-sidebar" class="sidebar apidocs">
                <div id="api-list">
                    <h2 class="off-left">APIs</h2>
                    <div id="api-tabview" class="tabview">
                        <ul class="tabs">
                            <li><a href="#api-classes">Classes</a></li>
                            <li><a href="#api-modules">Modules</a></li>
                        </ul>
                
                        <div id="api-tabview-filter">
                            <input type="search" id="api-filter" placeholder="Type to filter APIs">
                        </div>
                
                        <div id="api-tabview-panel">
                            <ul id="api-classes" class="apis classes">
                                <li><a href="../classes/RD...html">RD..</a></li>
                                <li><a href="../classes/RD.Billboard.html">RD.Billboard</a></li>
                                <li><a href="../classes/RD.Camera.html">RD.Camera</a></li>
                                <li><a href="../classes/RD.ParticlesEmissor.html">RD.ParticlesEmissor</a></li>
                                <li><a href="../classes/RD.PointCloud.html">RD.PointCloud</a></li>
                                <li><a href="../classes/RD.Renderer.html">RD.Renderer</a></li>
                                <li><a href="../classes/RD.Scene.html">RD.Scene</a></li>
                                <li><a href="../classes/RD.SceneNode.html">RD.SceneNode</a></li>
                                <li><a href="../classes/RD.Sprite.html">RD.Sprite</a></li>
                            </ul>
                
                
                            <ul id="api-modules" class="apis modules">
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="yui3-u-3-4">
                <div id="api-options">
                    Show:
                    <label for="api-show-inherited">
                        <input type="checkbox" id="api-show-inherited" checked>
                        Inherited
                    </label>
            
                    <label for="api-show-protected">
                        <input type="checkbox" id="api-show-protected">
                        Protected
                    </label>
            
                    <label for="api-show-private">
                        <input type="checkbox" id="api-show-private">
                        Private
                    </label>
                    <label for="api-show-deprecated">
                        <input type="checkbox" id="api-show-deprecated">
                        Deprecated
                    </label>
            
                </div>
            
            <div class="apidocs">
                <div id="docs-main">
                    <div class="content">
<h1>RD.Camera Class</h1>
<div class="box meta">


        <div class="foundat">
            Defined in: <a href="../files/.._src_rendeer.js.html#l2426"><code>..&#x2F;src&#x2F;rendeer.js:2426</code></a>
        </div>


</div>


<div class="box intro">
    <p>Camera wraps all the info about the camera (properties and view and projection matrices)</p>

</div>

    <div class="constructor">
        <h2>Constructor</h2>
<div id="method_RD.Camera" class="method item">
    <h3 class="name"><code>RD.Camera</code></h3>

        <span class="paren">()</span>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2426"><code>..&#x2F;src&#x2F;rendeer.js:2426</code></a>
        </p>



    </div>

    <div class="description">
        
    </div>




</div>
    </div>

<div id="classdocs" class="tabview">
    <ul class="api-class-tabs">
        <li class="api-class-tab index"><a href="#index">Index</a></li>

            <li class="api-class-tab methods"><a href="#methods">Methods</a></li>
            <li class="api-class-tab properties"><a href="#properties">Properties</a></li>
    </ul>

    <div>
        <div id="index" class="api-class-tabpanel index">
            <h2 class="off-left">Item Index</h2>

                <div class="index-section methods">
                    <h3>Methods</h3>

                    <ul class="index-list methods">
                            <li class="index-item method">
                                <a href="#method_applyController">applyController</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_getFront">getFront</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_getLocalVector">getLocalVector</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_getLocalVector">getLocalVector</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_getRay">getRay</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_getRayPlaneCollision">getRayPlaneCollision</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_lookAt">lookAt</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_move">move</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_moveLocal">moveLocal</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_orthographic">orthographic</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_perspective">perspective</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_project">project</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_rotate">rotate</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_rotate">rotate</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_rotateLocal">rotateLocal</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_testBox">testBox</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_testSphere">testSphere</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_unproject">unproject</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_updateMatrices">updateMatrices</a>

                            </li>
                            <li class="index-item method">
                                <a href="#method_updateVectors">updateVectors</a>

                            </li>
                    </ul>
                </div>

                <div class="index-section properties">
                    <h3>Properties</h3>

                    <ul class="index-list properties">
                            <li class="index-item property">
                                <a href="#property_aspect">aspect</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_far">far</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_fov">fov</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_frustum_size">frustum_size</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_near">near</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_position">position</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_target">target</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_type">type</a>

                            </li>
                            <li class="index-item property">
                                <a href="#property_up">up</a>

                            </li>
                    </ul>
                </div>


        </div>

            <div id="methods" class="api-class-tabpanel">
                <h2 class="off-left">Methods</h2>

<div id="method_applyController" class="method item">
    <h3 class="name"><code>applyController</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>dt</code>
                </li>
                <li class="arg">
                        <code>e</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2883"><code>..&#x2F;src&#x2F;rendeer.js:2883</code></a>
        </p>



    </div>

    <div class="description">
        <p>Used to move the camera (helps during debug)</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">dt</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                        <p>delta time from update</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">e</code>
                        <span class="type">Event</span>


                    <div class="param-description">
                        <p>mouse event or keyboard event</p>

                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_getFront" class="method item">
    <h3 class="name"><code>getFront</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>dest</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2678"><code>..&#x2F;src&#x2F;rendeer.js:2678</code></a>
        </p>



    </div>

    <div class="description">
        <p>gets the front vector normalized</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">dest</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>[Optional]</p>

                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>front vector</p>

            </div>
        </div>


</div>
<div id="method_getLocalVector" class="method item">
    <h3 class="name"><code>getLocalVector</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>v</code>
                </li>
                <li class="arg">
                        <code>result</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2648"><code>..&#x2F;src&#x2F;rendeer.js:2648</code></a>
        </p>



    </div>

    <div class="description">
        <p>transform vector (only rotates) from local to global</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">v</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">result</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>[Optional]</p>

                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>local point transformed</p>

            </div>
        </div>


</div>
<div id="method_getLocalVector" class="method item">
    <h3 class="name"><code>getLocalVector</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>v</code>
                </li>
                <li class="arg">
                        <code>result</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2663"><code>..&#x2F;src&#x2F;rendeer.js:2663</code></a>
        </p>



    </div>

    <div class="description">
        <p>transform point from local to global</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">v</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">result</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>[Optional]</p>

                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>local point transformed</p>

            </div>
        </div>


</div>
<div id="method_getRay" class="method item">
    <h3 class="name"><code>getRay</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>x</code>
                </li>
                <li class="arg">
                        <code>y</code>
                </li>
                <li class="arg">
                        <code class="optional">[viewport=gl.viewport]</code>
                </li>
                <li class="arg">
                        <code class="optional">[out]</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Object</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2816"><code>..&#x2F;src&#x2F;rendeer.js:2816</code></a>
        </p>



    </div>

    <div class="description">
        <p>gets the ray passing through one pixel</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">x</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">y</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[viewport=gl.viewport]</code>
                        <span class="type">Array</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[out]</code>
                        <span class="type">Object</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                        <p>{ origin: vec3, direction: vec3 }</p>

                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Object</span>:
                    <p>ray object { origin: vec3, direction:vec3 }</p>

            </div>
        </div>


</div>
<div id="method_getRayPlaneCollision" class="method item">
    <h3 class="name"><code>getRayPlaneCollision</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>x</code>
                </li>
                <li class="arg">
                        <code>y</code>
                </li>
                <li class="arg">
                        <code>position</code>
                </li>
                <li class="arg">
                        <code>normal</code>
                </li>
                <li class="arg">
                        <code class="optional">[result=vec3]</code>
                </li>
                <li class="arg">
                        <code class="optional">[viewport=vec4]</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2850"><code>..&#x2F;src&#x2F;rendeer.js:2850</code></a>
        </p>



    </div>

    <div class="description">
        <p>given a screen coordinate it cast a ray and returns the collision point with a given plane</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">x</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">y</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">position</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>Plane point</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">normal</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>Plane normal</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[result=vec3]</code>
                        <span class="type">Vec3</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[viewport=vec4]</code>
                        <span class="type">Vec4</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>the collision point, or null</p>

            </div>
        </div>


</div>
<div id="method_lookAt" class="method item">
    <h3 class="name"><code>lookAt</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>position</code>
                </li>
                <li class="arg">
                        <code>target</code>
                </li>
                <li class="arg">
                        <code>up</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2577"><code>..&#x2F;src&#x2F;rendeer.js:2577</code></a>
        </p>



    </div>

    <div class="description">
        <p>configure view of the camera</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">position</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">target</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">up</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_move" class="method item">
    <h3 class="name"><code>move</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>v</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2692"><code>..&#x2F;src&#x2F;rendeer.js:2692</code></a>
        </p>



    </div>

    <div class="description">
        <p>move the position and the target</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">v</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_moveLocal" class="method item">
    <h3 class="name"><code>moveLocal</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>v</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2704"><code>..&#x2F;src&#x2F;rendeer.js:2704</code></a>
        </p>



    </div>

    <div class="description">
        <p>move the position and the target using the local coordinates system of the camera</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">v</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_orthographic" class="method item">
    <h3 class="name"><code>orthographic</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>frustum_size</code>
                </li>
                <li class="arg">
                        <code>near</code>
                </li>
                <li class="arg">
                        <code>far</code>
                </li>
                <li class="arg">
                        <code>aspect</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2558"><code>..&#x2F;src&#x2F;rendeer.js:2558</code></a>
        </p>



    </div>

    <div class="description">
        <p>changes the camera to orthographic mode (frustumsize is top-down)</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">frustum_size</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">near</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">far</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">aspect</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_perspective" class="method item">
    <h3 class="name"><code>perspective</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>fov</code>
                </li>
                <li class="arg">
                        <code>aspect</code>
                </li>
                <li class="arg">
                        <code>near</code>
                </li>
                <li class="arg">
                        <code>far</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2539"><code>..&#x2F;src&#x2F;rendeer.js:2539</code></a>
        </p>



    </div>

    <div class="description">
        <p>changes the camera to perspective mode</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">fov</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">aspect</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">near</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">far</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_project" class="method item">
    <h3 class="name"><code>project</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>vec</code>
                </li>
                <li class="arg">
                        <code class="optional">[viewport=gl.viewport]</code>
                </li>
                <li class="arg">
                        <code class="optional">[result=vec3]</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2777"><code>..&#x2F;src&#x2F;rendeer.js:2777</code></a>
        </p>



    </div>

    <div class="description">
        <p>projects a point from 3D to 2D</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">vec</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>coordinate to project</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[viewport=gl.viewport]</code>
                        <span class="type">Array</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[result=vec3]</code>
                        <span class="type">Vec3</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>the projected point</p>

            </div>
        </div>


</div>
<div id="method_rotate" class="method item">
    <h3 class="name"><code>rotate</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>angle</code>
                </li>
                <li class="arg">
                        <code>axis</code>
                </li>
                <li class="arg">
                        <code class="optional">[center=null]</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2748"><code>..&#x2F;src&#x2F;rendeer.js:2748</code></a>
        </p>



    </div>

    <div class="description">
        <p>rotate around its target position</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">angle</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                        <p>in radians</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">axis</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[center=null]</code>
                        <span class="type">Vec3</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                        <p>if another center is provided it rotates around it</p>

                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_rotate" class="method item">
    <h3 class="name"><code>rotate</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>angle</code>
                </li>
                <li class="arg">
                        <code>axis</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2717"><code>..&#x2F;src&#x2F;rendeer.js:2717</code></a>
        </p>



    </div>

    <div class="description">
        <p>rotate over its position</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">angle</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                        <p>in radians</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">axis</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_rotateLocal" class="method item">
    <h3 class="name"><code>rotateLocal</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>angle</code>
                </li>
                <li class="arg">
                        <code>axis</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2732"><code>..&#x2F;src&#x2F;rendeer.js:2732</code></a>
        </p>



    </div>

    <div class="description">
        <p>rotate over its position</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">angle</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                        <p>in radians</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">axis</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>in local coordinates</p>

                    </div>

                </li>
            </ul>
        </div>



</div>
<div id="method_testBox" class="method item">
    <h3 class="name"><code>testBox</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>center</code>
                </li>
                <li class="arg">
                        <code>halfsize</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Number</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2974"><code>..&#x2F;src&#x2F;rendeer.js:2974</code></a>
        </p>



    </div>

    <div class="description">
        <p>test if box is inside frustrum (you must call camera.extractPlanes() previously to update frustrum planes)</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">center</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>center of the box</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name">halfsize</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>halfsize of the box (vector from center to corner)</p>

                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Number</span>:
                    <p>CLIP_OUTSIDE or CLIP_INSIDE or CLIP_OVERLAP</p>

            </div>
        </div>


</div>
<div id="method_testSphere" class="method item">
    <h3 class="name"><code>testSphere</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>center</code>
                </li>
                <li class="arg">
                        <code>radius</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Number</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l3005"><code>..&#x2F;src&#x2F;rendeer.js:3005</code></a>
        </p>



    </div>

    <div class="description">
        <p>test if sphere is inside frustrum (you must call camera.extractPlanes() previously to update frustrum planes)</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">center</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name">radius</code>
                        <span class="type">Number</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Number</span>:
                    <p>CLIP_OUTSIDE or CLIP_INSIDE or CLIP_OVERLAP</p>

            </div>
        </div>


</div>
<div id="method_unproject" class="method item">
    <h3 class="name"><code>unproject</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>vec</code>
                </li>
                <li class="arg">
                        <code class="optional">[viewport=gl.viewport]</code>
                </li>
                <li class="arg">
                        <code class="optional">[result=vec3]</code>
                </li>
            </ul><span class="paren">)</span>
        </div>

        <span class="returns-inline">
            <span class="type">Vec3</span>
        </span>







    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2800"><code>..&#x2F;src&#x2F;rendeer.js:2800</code></a>
        </p>



    </div>

    <div class="description">
        <p>projects a point from 2D to 3D</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">vec</code>
                        <span class="type">Vec3</span>


                    <div class="param-description">
                        <p>coordinate to unproject</p>

                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[viewport=gl.viewport]</code>
                        <span class="type">Array</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
                <li class="param">
                        <code class="param-name optional">[result=vec3]</code>
                        <span class="type">Vec3</span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>

        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                        <span class="type">Vec3</span>:
                    <p>the projected point</p>

            </div>
        </div>


</div>
<div id="method_updateMatrices" class="method item">
    <h3 class="name"><code>updateMatrices</code></h3>

        <span class="paren">()</span>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2593"><code>..&#x2F;src&#x2F;rendeer.js:2593</code></a>
        </p>



    </div>

    <div class="description">
        <p>update view projection matrices</p>

    </div>




</div>
<div id="method_updateVectors" class="method item">
    <h3 class="name"><code>updateVectors</code></h3>

        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
                <li class="arg">
                        <code>model_matrix</code>
                </li>
            </ul><span class="paren">)</span>
        </div>








    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2634"><code>..&#x2F;src&#x2F;rendeer.js:2634</code></a>
        </p>



    </div>

    <div class="description">
        <p>update camera using a model_matrix as reference</p>

    </div>

        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
                <li class="param">
                        <code class="param-name">model_matrix</code>
                        <span class="type">Mat4</span>


                    <div class="param-description">
                         
                    </div>

                </li>
            </ul>
        </div>



</div>
            </div>

            <div id="properties" class="api-class-tabpanel">
                <h2 class="off-left">Properties</h2>

<div id="property_aspect" class="property item">
    <h3 class="name"><code>aspect</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2456"><code>..&#x2F;src&#x2F;rendeer.js:2456</code></a>
        </p>


    </div>

    <div class="description">
        <p>aspect (width / height)</p>

    </div>

        <p><strong>Default:</strong> 1</p>


</div>
<div id="property_far" class="property item">
    <h3 class="name"><code>far</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2450"><code>..&#x2F;src&#x2F;rendeer.js:2450</code></a>
        </p>


    </div>

    <div class="description">
        <p>far distance</p>

    </div>

        <p><strong>Default:</strong> 10000</p>


</div>
<div id="property_fov" class="property item">
    <h3 class="name"><code>fov</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2462"><code>..&#x2F;src&#x2F;rendeer.js:2462</code></a>
        </p>


    </div>

    <div class="description">
        <p>fov angle in degrees</p>

    </div>

        <p><strong>Default:</strong> 45</p>


</div>
<div id="property_frustum_size" class="property item">
    <h3 class="name"><code>frustum_size</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2468"><code>..&#x2F;src&#x2F;rendeer.js:2468</code></a>
        </p>


    </div>

    <div class="description">
        <p>size of frustrum when working in orthographic</p>

    </div>

        <p><strong>Default:</strong> 50</p>


</div>
<div id="property_near" class="property item">
    <h3 class="name"><code>near</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2444"><code>..&#x2F;src&#x2F;rendeer.js:2444</code></a>
        </p>


    </div>

    <div class="description">
        <p>near distance</p>

    </div>

        <p><strong>Default:</strong> 0.1</p>


</div>
<div id="property_position" class="property item">
    <h3 class="name"><code>position</code></h3>
    <span class="type">Vec3</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2508"><code>..&#x2F;src&#x2F;rendeer.js:2508</code></a>
        </p>


    </div>

    <div class="description">
        <p>Position where the camera eye is located</p>

    </div>



</div>
<div id="property_target" class="property item">
    <h3 class="name"><code>target</code></h3>
    <span class="type">Vec3</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2518"><code>..&#x2F;src&#x2F;rendeer.js:2518</code></a>
        </p>


    </div>

    <div class="description">
        <p>Where the camera is looking at, the center of where is looking</p>

    </div>



</div>
<div id="property_type" class="property item">
    <h3 class="name"><code>type</code></h3>
    <span class="type">Number</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2433"><code>..&#x2F;src&#x2F;rendeer.js:2433</code></a>
        </p>


    </div>

    <div class="description">
        <p>the camera type, RD.Camera.PERSPECTIVE || RD.Camera.ORTHOGRAPHIC</p>

    </div>

        <p><strong>Default:</strong> RD.Camera.PERSPECTIVE</p>


</div>
<div id="property_up" class="property item">
    <h3 class="name"><code>up</code></h3>
    <span class="type">Vec3</span>





    <div class="meta">
                <p>
                Defined in
        <a href="../files/.._src_rendeer.js.html#l2528"><code>..&#x2F;src&#x2F;rendeer.js:2528</code></a>
        </p>


    </div>

    <div class="description">
        <p>Up vector</p>

    </div>

        <p><strong>Default:</strong> [0,1,0]</p>


</div>
            </div>


    </div>
</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../assets/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
<script src="../assets/js/yui-prettify.js"></script>
<script src="../assets/../api.js"></script>
<script src="../assets/js/api-filter.js"></script>
<script src="../assets/js/api-list.js"></script>
<script src="../assets/js/api-search.js"></script>
<script src="../assets/js/apidocs.js"></script>
</body>
</html>
